<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>欢迎使用 - 游戏工作室记账系统</title>
    <link rel="shortcut icon" href="/images/favicon.ico"/>
    <link href="/js/jquery-easyui-1.5.3/themes/default/easyui.css" rel="stylesheet"/>
    <link href="/js/jquery-easyui-1.5.3/themes/icon.css" rel="stylesheet"/>
    <link href="/css/default.css" rel="stylesheet"/>
    <link href="/css/font-awesome.min.css" rel="stylesheet"/>
    <script src="/js/jquery-1.12.4.min.js"></script>
    <script src="/js/jquery-easyui-1.5.3/jquery.easyui.min.js"></script>
    <script src="/js/jquery-easyui-1.5.3/locale/easyui-lang-zh_CN.js"></script>
    <!--[if lt IE 9]>
    <script src="/js/html5shiv.min.js"></script>
    <script src="/js/respond.min.js"></script>
    <![endif]-->
</head>
<body class="easyui-layout">
<div class="header" data-options="region:'north',border:false">
    <div class="header-left">
        <h1>游戏工作室记账系统</h1>
    </div>
    <div class="header-right">
        <p>
            <strong>${userName}</strong>，欢迎您！
            <a href="javascript:;" id="logOut" class="easyui-linkbutton" style="color:#ff0000;">
                <i class="fa fa-power-off"></i>安全退出
            </a>
        </p>
    </div>
</div>
<%--左侧--%>
<div class="sidebar" data-options="region:'west',split:true,title:'导航菜单'">
    <div class="easyui-accordion" data-options="border:false,fit:true">
        <div title="交易管理 " data-options="iconCls:'icon-chart-organisation'">
            ${menu}
        </div>
        <div title="数据查询 " data-options="iconCls:'item.getOpenIcon()'">
            <ul class="easyui-tree side-tree .icon-add">
                <li iconCls=".icon-add"><a href="javascript:" title="下班"  data-icon=".mini_add" data-link="/goHome/home" iframe="1">下班 </a>
                </li>
                <li iconCls=".icon-add"><a href="javascript:" title="特殊交易"  data-icon=".mini_add" data-link="/specialDeal/home" iframe="1">特殊交易 </a>
                </li>
                <li iconCls=".icon-edit"><a href="javascript:" title="正常交易数据"  data-icon="iconCls:'.icon-add'" data-link="/dataQuery/normalDealQuery" iframe="1">正常交易数据 </a>
                </li>
                <li iconCls=".icon-add"><a href="javascript:" title="游戏账号变化"  data-icon=".mini_add" data-link="/dataQuery/gameAccountQuery" iframe="1">游戏账号变化 </a>
                </li>
                <li iconCls=".icon-add"><a href="javascript:" title="银行余额变化"  data-icon=".mini_add" data-link="/dataQuery/moneyDealQuery" iframe="1">银行余额变化 </a>
                </li>
                <li iconCls=".icon-add"><a href="javascript:" title="打印报表"  data-icon=".mini_add" data-link="/report/toReport" iframe="1">打印报表 </a>
                </li>
            </ul>
        </div>

        <div title="游戏管理 " data-options="iconCls:'item.getOpenIcon()'">
            <ul class="easyui-tree side-tree">
                <li iconCls=" mini_add "><a href="javascript:" title="所经营游戏管理"  data-icon="mini_add" data-link="/games/home" iframe="1"> 所经营游戏管理 </a>
                </li>
            </ul>
        </div>

        <div title="游戏账号管理 " data-options="iconCls:'item.getOpenIcon()'">
            <ul class="easyui-tree side-tree">
                <li iconCls=" mini_add "><a href="javascript:" title="游戏账号管理"  data-icon="mini_add" data-link="/gameAccount/home" iframe="1"> 游戏账号管理 </a>
                </li>
            </ul>
        </div>

        <div title="银行卡管理 " data-options="iconCls:'item.getOpenIcon()'">
            <ul class="easyui-tree side-tree">
                <li iconCls=" mini_add "><a href="javascript:" title="银行卡管理"  data-icon="mini_add" data-link="/bankCard/home" iframe="1"> 银行卡管理 </a>
                </li>
            </ul>
        </div>
        <div title="用户管理 " data-options="iconCls:'item.getOpenIcon()'">
            <ul class="easyui-tree side-tree">
                <li iconCls=" mini_add "><a href="javascript:" title="修改密码"  data-icon="mini_add" data-link="item.getUrl()" iframe="1"> 修改密码 </a>
                </li>
                <li iconCls=" mini_add "><a href="javascript:" title="权限管理"  data-icon="mini_add" data-link="item.getUrl()" iframe="1"> 权限管理 </a>
                </li>
            </ul>
        </div>

    </div>
</div>
<%--下、右侧--%>
<div class="footer" data-options="region:'south',border:false">
    技术支持：小任&nbsp;&nbsp;<i class="fa fa-phone"></i>18781073687
</div>
<div data-options="region:'center'">
    <div id="idx-tabs" class="easyui-tabs" data-options="fit:true,border:false,plain:true">
        <div title="首页" data-options="closable:false,iconCls:'icon-tip',cls:'pd3'" style="padding:10px;">
            <h2 style="text-align: center">欢迎使用游戏工作室记账系统</h2>
        </div>
    </div>
</div>
<script>
    $(function () {
        $("#logOut").click(function () {
            $.messager.confirm('提示信息', '确认退出系统?', function (r) {
                if (r) {
                    location.href = "/home/logOut";
                }
            });
        });
        $('.side-tree a').bind("click", function () {
            //var title = $(this).text();
            var title = $(this).attr("title");
            var url = $(this).attr('data-link');
            //bootstrap的图标
            var iconCls = $(this).attr('data-icon');
            var iframe = $(this).attr('iframe') == 1 ? true : false;
            open1(title, url, iconCls, iframe);
        });
        $.extend($.fn.tabs.methods, {
            //显示遮罩
            loading: function (jq, msg) {
                return jq.each(function () {
                    var panel = $(this).tabs("getSelected");
                    if (msg == undefined) {
                        msg = "正在加载数据，请稍候...";
                    }
                    $("<div class=\"datagrid-mask\"></div>").css({
                        display: "block",
                        width: "100%",
                        height: "100%"
                    }).appendTo(panel);
                    $("<div class=\"datagrid-mask-msg\"></div>").html(msg).appendTo(panel).css({
                        display: "block",
                        left: (panel.width() - $("div.datagrid-mask-msg", panel).outerWidth()) / 2,
                        top: (panel.height() - $("div.datagrid-mask-msg", panel).outerHeight()) / 2
                    });
                });
            },
            //隐藏遮罩
            loaded: function (jq) {
                return jq.each(function () {
                    var panel = $(this).tabs("getSelected");
                    panel.find("div.datagrid-mask-msg").remove();
                    panel.find("div.datagrid-mask").remove();
                });
            }
        });
    });

    function open1(title, href, iconCls, iframe) {
        //得到中间主范围
        var tabPanel = $('#idx-tabs');
        var tabCount = tabPanel.tabs("tabs").length;
        if (tabCount > 2) {
            //超过2个选项卡时关闭第一个
            tabPanel.tabs("close", 1);
        }
        //判断是否存在，没有就创建新的
        if (tabPanel.tabs('exists', title)) {
            tabPanel.tabs('select', title);
        }
        else {
            //有就看看iframe的boolean
            if (iframe) {
                //如果iframe=1，是true
                var reg = new RegExp("/\//", "g");
                var id = href.replace(reg, "");
                var content = '<iframe id="' + id + '" scrolling="auto" frameborder="0"  src="' + href + '" width="100%" height="100%" style="padding:0;margin:0;"></iframe>';
                tabPanel.tabs('add', {
                    title: title,
                    content: content,
                    iconCls: iconCls,
                    fit: true,
                    cls: 'pd3',
                    closable: true
                });
                tabPanel.tabs("loading");
                //var frame = tabPanel.find("iframe")[0];
                var frame = document.getElementById(id);
                //console.log(frame)
                //绑定页面加载完成onload事件
                if (frame.attachEvent) {
                    frame.attachEvent("onload", function () {
                        //console.log("end1");
                        tabPanel.tabs("loaded");
                    });
                } else {
                    frame.onload = function () {
                        //console.log("end2");
                        tabPanel.tabs("loaded");
                    };
                }
            }
            else {
                //如果iframe！=1，是false
                tabPanel.tabs('add', {
                    title: title,
                    href: href,
                    iconCls: iconCls,
                    fit: true,
                    cls: 'pd3',
                    closable: true
                });
            }
        }
    }
</script>
</body>
</html>